<template>
	<div class="rightmain">
		<div class="title">
			<div class="titleBadge"></div>
			待审批
		</div>
		<div v-loading="loading" style="margin-top: 30px">
			<el-table border
			          :data="tableData"
			          style="width: 100%">
				<el-table-column prop="RoomName" label="会议室名称" align="center"></el-table-column>
				<el-table-column prop="Position" label="会议室位置" align="center"></el-table-column>
				<el-table-column prop="roomName" label="状态" align="center">
					<template slot-scope="scope">
						{{getApprovalResult(scope.row.ApprovalResult)}}
					</template>
				</el-table-column>
				<el-table-column prop="Capacity" label="容纳人数" align="center"></el-table-column>
				<el-table-column prop="roomName" label="会议时间" align="center">
					<template slot-scope="scope">
						{{meetingTime(scope.row.BeginTimeStamp,scope.row.EndTimeStamp)}}
					</template>
				</el-table-column>
				<el-table-column prop="BookerUserName" label="使用人" align="center"></el-table-column>
				<el-table-column prop="roomName" label="操作" align="center" width="150">
					<template slot-scope="scope">
						<el-button type="text" @click="agree(scope.row)">通过</el-button>
						<el-button type="text" @click="refuse(scope.row)">驳回</el-button>
					</template>
				</el-table-column>
			</el-table>
		</div>
		<el-dialog
						title="驳回理由"
						:visible.sync="dialogVisible"
						width="400px">
			<el-form :model="Form" :rules="rules" ref="ruleForm" v-if="dialogVisible">
				<el-form-item prop="Remark">
					<el-input  :autosize="{ minRows: 4, maxRows: 8}" type="textarea" v-model="Form.Remark" placeholder="请输入驳回理由"></el-input>
				</el-form-item>

			</el-form>
			<span slot="footer" style="text-align: center">
                <el-button @click="dialogVisible = false">取 消</el-button>
                <el-button type="primary" :loading="dialogloading" @click="refuseAction">确 定</el-button>
            </span>
		</el-dialog>
	</div>
</template>
<script type="es6">
import meetingTable from '../mixin/meetingTable';
import Reserve from '../mixin/Reserve';
import myCommon from '../mixin/myCommon';
import API from '@/API';
export default {
  mixins: [Reserve, meetingTable, myCommon],
  data () {
    return {
      dialogVisible: false,
      dialogloading: false,
      tableData: [],
      loading: false,
      Form: {
        Remark: '',
        ApprovalID: ''
      },
      rules: {
        Remark: [
          { required: true, message: '请输入驳回理由', trigger: 'blur' }
        ]
      }
    };
  },
  components: {},
  computed: {},
  methods: {
    resetForm () {},
    search () {
      this.loading = true;
      API.gettapprovalLis().then((res) => {
        this.loading = false;
        let json = res.data;
        if (json.status === '200') {
          this.tableData = json.data;
        }
      }).catch(() => {
        this.loading = false;
      });
    },
    agree (item) {
      this.loading = true;
      API.approvalAgree({
        ApprovalID: item.ApprovalID,
        ApprovalOpinion: ''
      }).then((res) => {
        let json = res.data;
        if (json.status === '200') {
          this.$notify({
            title: '成功',
            message: '审批通过成功',
            type: 'success'
          });
          this.search();
        } else {
          this.loading = false;
          this.$notify({
            title: '失败',
            message: json.err,
            type: 'error'
          });
        }
      }).catch(() => {
        this.loading = false;
      });
    },
    refuse (item) {
      this.Form.ApprovalID = item.ApprovalID;
      this.dialogVisible = true;
    },
    refuseAction () {
      this.dialogloading = true;
      API.approvalRefuse({
        ApprovalID: this.Form.ApprovalID,
        ApprovalOpinion: this.Form.Remark
      }).then((res) => {
        this.dialogloading = false;
        this.dialogVisible = false;
        let json = res.data;
        if (json.status === '200') {
          this.$notify({
            title: '成功',
            message: '审批驳回成功',
            type: 'success'
          });
          this.search();
        } else {
          this.$notify({
            title: '失败',
            message: json.err,
            type: 'error'
          });
          if (json.status === '210000') {
            this.search();
          }
        }
      }).catch(() => {
        this.dialogloading = false;
      });
    }
  },
  mounted () {
    this.search();
  }
};
</script>
<style lang="less">
	@import "../../styles/userCommon";
</style>
